<template>
  <a-drawer v-model:visible="visible" title="设备资源详情" :width="width >= 600 ? 600 : '100%'" :footer="false">
    <a-descriptions :column="2" size="large" class="general-description">
      <a-descriptions-item label="ID">{{ dataDetail?.id }}</a-descriptions-item>
      <a-descriptions-item label="设备名称">{{ dataDetail?.name }}</a-descriptions-item>
      <a-descriptions-item label="设备类别">{{ dataDetail?.category }}</a-descriptions-item>
      <a-descriptions-item label="管理编号">{{ dataDetail?.managementNumber }}</a-descriptions-item>
      <a-descriptions-item label="型号">{{ dataDetail?.modelNumber }}</a-descriptions-item>
      <a-descriptions-item label="出厂编号">{{ dataDetail?.factoryNumber }}</a-descriptions-item>
      <a-descriptions-item label="计量单位">{{ dataDetail?.measureUnit }}</a-descriptions-item>
      <a-descriptions-item label="数量">{{ dataDetail?.count }}</a-descriptions-item>
      <a-descriptions-item label="状态">{{ dataDetail?.status }}</a-descriptions-item>
      <a-descriptions-item label="放置位置">{{ dataDetail?.location }}</a-descriptions-item>
      <a-descriptions-item label="购置来源">{{ dataDetail?.source }}</a-descriptions-item>
      <a-descriptions-item label="购置时间">{{ dataDetail?.buyDate }}</a-descriptions-item>
      <a-descriptions-item label="生产厂家">{{ dataDetail?.manufacturer }}</a-descriptions-item>
      <a-descriptions-item label="购置金额">{{ dataDetail?.purchaseAmount }}</a-descriptions-item>
      <a-descriptions-item label="备注">{{ dataDetail?.mark }}</a-descriptions-item>
      <a-descriptions-item label="物资去向">{{ dataDetail?.destination }}</a-descriptions-item>
      <a-descriptions-item label="创建人">{{ dataDetail?.createUser }}</a-descriptions-item>
      <a-descriptions-item label="创建人">{{ dataDetail?.createUserString }}</a-descriptions-item>
      <a-descriptions-item label="创建时间">{{ dataDetail?.createTime }}</a-descriptions-item>
      <a-descriptions-item label="修改人">{{ dataDetail?.updateUser }}</a-descriptions-item>
      <a-descriptions-item label="修改人">{{ dataDetail?.updateUserString }}</a-descriptions-item>
      <a-descriptions-item label="修改时间">{{ dataDetail?.updateTime }}</a-descriptions-item>
    </a-descriptions>
  </a-drawer>
</template>

<script setup lang="ts">
  import {useWindowSize} from '@vueuse/core'
  import {
        type DeviceInfoDetailResp, getDeviceInfo as getDetail
    } from '@/apis/task/deviceInfo'

const { width } = useWindowSize()

const dataId = ref('')
const dataDetail = ref<DeviceInfoDetailResp>()
const visible = ref(false)

// 查询详情
const getDataDetail = async () => {
  const { data } = await getDetail(dataId.value)
  dataDetail.value = data
}

// 打开
const onOpen = async (id: string) => {
  dataId.value = id
  await getDataDetail()
  visible.value = true
}

defineExpose({ onOpen })
</script>

<style scoped lang="scss"></style>